<!--
 * @Author: zw 775925302@qq.com
 * @Date: 2023-02-17 22:39:22
 * @LastEditors: zw 775925302@qq.com
 * @LastEditTime: 2023-02-18 22:35:32
 * @Description: 属性组件通用的布局
 1. 引入全局的mixins
 2. 需要把数据传递给slot
-->
<template>
  <el-form-item :label="mconfig.name + ':'" :prop="mconfig.key" :label-width="getLabelWidth" v-if="!mconfig.hidden">
    <slot></slot>
  </el-form-item>
</template>

<script lang="ts">
import type { PropType } from "vue";
import type { TypeAttrCmpProtocal } from "@/types/TypeDesign";
import { computed, defineComponent } from "vue";

export default defineComponent({
  name: "AttrCmpBase",
  props: {
    mconfig: {
      type: Object as PropType<TypeAttrCmpProtocal>,
      default: () => {},
      required: true,
    },
  },
  emits: [],
  setup(props) {
    const getLabelWidth = computed(() => {
      if (props.mconfig.labelWidthAuto) {
        return "auto";
      }
      return "";
    });
    return {
      getLabelWidth,
    };
  },
});
</script>
<style scoped lang="scss"></style>
